<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"/>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script>
	//2014/08/06 geolocation api test
	
	var g_timer_id; // callbacks
	var g_geo_id;
	
	var g_latitude; // geo data
	var g_longitude;
	var g_altitude;
	var g_accuracy;

	$(document).ready(function(){
	
		if (navigator.geolocation) {
			
			g_timer_id = setInterval(
				function(position){
					console.log('timer callback called');
					$('#lat').html(g_latitude);
					$('#lng').html(g_longitude);
					$('#alt').html(g_altitude);
					$('#acc').html(g_accuracy);
				},
				15000 // interval
			);
			
			// Note: Use getCurrentPosition() for one time op.
			// It is asked for permission every time it is called

			g_geo_id = navigator.geolocation.watchPosition(
				function(position){
					console.log('geo callback called');
					g_latitude = position.coords.latitude;
					g_longitude = position.coords.longitude;
					g_altitude = position.coords.altitude;
					g_accuracy = position.coords.accuracy;
				},
				function(error){
					alert(error.code + ": " + error.message); // not called on win7/firefox
				}
			);
		}
	});
	
	// on page leave, do:
	// clearInterval(g_timer_id);
	// navigator.geolocation.clearWatch(g_geo_id);
	
</script>
</head>
<body>
<p>
Latitude: <span id="lat"></span><br/>
Longitude: <span id="lng"></span><br/>
Altitude: <span id="alt"></span><br/>
Accuracy: <span id="acc"></span>
</p>
</body>
</html>
